<template>
  <div class="app-container">
    <p>所属分类：{{ catName }}</p>
    <pub-spec ref="spec"/>

    <div class="btns">
      <el-button type="primary" style="margin-top: 12px;" @click="exit">退 出</el-button>
      <el-button type="primary" style="margin-top: 12px;" @click="submit">提 交</el-button>
    </div>
  </div>
</template>

<script>
import pubSpec from '@/views/product/mainte/publish/components/pubSpec'

export default {
  name: 'index',
  components: { pubSpec },
  data() {
    return {
      spuId: this.$route.params.spuId,
      catId: this.$route.params.catId,
      catName: this.$route.params.catName
    }
  },
  created() {
    this.$nextTick(() => {
      this.$refs.spec.init(this.catId, this.spuId)
    })
  },
  methods: {
    exit() {
      this.$tab.closePage()
    },
    submit() {
      if (this.$refs.spec.validate()) {
        let form = this.$refs.spec.getForm()
        this.$api.post('/product/spuInfo/updateSpec/' + this.spuId, form).then(resp => {
          this.$modal.msgSuccess('操作成功')
        })
      } else {
        this.$modal.msgError('请选择规格参数')
      }
    }
  }
}
</script>

<style scoped>
.btns {
  display: flex;
  justify-content: center;

  margin-top: 30px;
  margin-bottom: 80px;
}
</style>
